<script type="text/javascript" src="/js/merchant/receiving.js"></script>
<script type="text/javascript">

function tabSelect(obj,status){
	$('[name=receiving_status]').val(status);
	$(obj).addClass('tab-li-click');
	$(obj).siblings().removeClass('tab-li-click');

	initData(0);
	
}

</script>
<style>
	
	.bgc{background:#F2F8FD}
	.radiu{-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px;overflow: hidden;}
	.info-top{height:10px}
	.tab-li{ float:left; padding:0; cursor:pointer; background:url(/images/menu-li-bg.gif) no-repeat center top; width:92px; height:25px; line-height:25px; text-align:center; color:white}
	.tab-li-click{background:url(/images/menu-li-bg-hover.gif) no-repeat center top}
	.tab-li:hover{ background:url(/images/menu-li-bg-hover.gif) no-repeat center top}
	.info-header{width:100%;height:200px;background:url(/images/nav-bg.png) no-repeat center top;border-bottom:1px solid #CCC;position:relative}
	.info-header h3{text-indent:10px;}
	.info-content{}
	.info-content-body{border-top:1px solid #CCC;width:100%;clear:both;min-height: 200px;}
	.info-content-menu{width:100%;height:25px}
	.info-header-content{position:absolute;top:50px;left:10px;width:870px;border:1px solid #CCC;}
	.cell20{width:180px;height:25px;line-height:25px;display:inline-block;overflow:hidden;border-bottom:1px solid #CCC;margin:0px;border-right:1px solid #CCC;margin:0px;float:left}
	.cell30{width:253px;height:25px;line-height:25px;display:inline-block;overflow:hidden;border-bottom:1px solid #CCC;margin:0px;border-right:1px solid #CCC;margin:0px;margin:0px;float:left}
	.no-bottom{border-bottom:none}
	.no-right{border-right:none}
	.error{color:red}
		
.line1 {
	height: 25px;
	width: 100%;
	background: none repeat scroll 0 0 #FFFFFF;
	text-align:center;
}
.line1:hover, .line2:hover{
	background-color:#F2F8F9;
}

.line2 {
	height: 25px;
	width: 100%;
}


.tdCol1 {
    float: left;
    line-height: 25px;     
    width: 14%;
}
.tdCol2 {
    float: left;
    line-height: 25px;     
    width: 15%;
}
.tdCol3 {
    float: left;
    line-height: 25px;
    width: 10%;
}
.tdCol4 {
    float: left;
    line-height: 25px;
    width: 10%;
}
.tdCol5 {
    float: left;
    line-height: 25px;
    width: 10%;
}

.tdCol6 {
    float: left;
    line-height: 25px;
    width: 15%;
}
.tdCol7{
    float: left;
    line-height: 25px;
    width: 10%;
}
.tdCol8{
    float: left;
    line-height: 25px;
    width: 16%;
}	

div.cell{
	border-right:none;
	border-right-color:red;
}
</style>
<div class="position"><a href='/default/index'><{$languages['HOME']}></a> &gt; <a href='/merchant/my-account'><{$languages['MERCHANT_CENTER']}></a>  &gt; <{$languages['OPERATION']}> &gt; <{$languages['ASN_LIST']}></div>

<h4><{$languages['ASN_LIST']}></h4>
<div style="color:red;" id="message"></div>
<div id="search" style="margin-top:15px;margin-bottom:15px;">
<form id="search-form" name="search-form" method="post" action="">
	<{$languages['ASNCODE']}>:<input type="text" id="receiving_code" name="receiving_code" class="input-width-1" /> &nbsp;	&nbsp;
    <{$languages['REFERENCE_NO']}>:<input type="text" id="ref_id" name="ref_id" class="input-width-1" />	<br />
    <{$languages['Date_From']}>:
	<input type="text" class="dateFrom" id="dateFrom" name="dateFrom" class="input-width-1" /> &nbsp;
    <{$languages['TO']}>
	<input type="text" class="dateTo" id="dateTo" name="dateTo" class="input-width-1" /> &nbsp;&nbsp;	
	<span class="button-2" onclick="search()"><{$languages['SEARCH']}></span>
	<span class="button-2 toggleButton" refstatus="1" fold='<{$languages['FOLD']}>' unfold='<{$languages['UNFOLD']}>'><{$languages['FOLD_UNFOLD']}></span>
	<p> 
	<input type="hidden" name="receiving_status" id="receiving_status" value="<{$status}>" />
</form>
</div>

<div class="info-content">
		<div class="info-content-menu radiu">
			<ul class="bgc"><!-- tab-li-click -->
				<li class="tab-li" onclick="tabSelect(this,0)"> <{$languages['DELETE']}>(<span id="status0"></span>)</li>
				<li class="tab-li tab-li-click" onclick="tabSelect(this,1)"><{$languages['AWAITING']}>(<span id="status1"></span>) </li>
				<li class="tab-li" onclick="tabSelect(this,3)"> <{$languages['RECEIVED']}>(<span id="status3"></span>) </li>
				<li class="tab-li" onclick="tabSelect(this,4)"> <{$languages['ABNORMAL']}>(<span id="status4"></span>)</li>
			</ul>
		</div>
		
</div>

<div class="tab-div row">
	<div class="row height25 row-header">
		
	</div>

	<div id="receiving-list">  </div>

</div>
<div class="pagination" style="padding-top:10px"></div>
<div id="tipDialog" style="display:none" title="Tip"></div>
<div id="right_confirm" style="display: none;">
	<p style="text-align:center;font-size: 14px;color: red;font-weight: bold;">
	Are you sure to delete it?
	</p>
</div>
<div id="printDialog" style="display:none" title="Print"> </div>
<div id="row-header-content" style="display:none;">
    <div class=" cell" style="width:13%"><{$languages['ASNCODE']}></div>
    <div class="cell" style="width:10%"><{$languages['SKUNAME']}></div>
    <div class="cell" style="width:10%"><{$languages['WEIGHT']}></div>
    <div class="cell" style="width:10%"><{$languages['QUANTITY']}></div>
   <div class="cell" style="width:12%"><{$languages['RECEIVED_QUANTITY']}></div>
   <div class="cell no-background" style="width:18%"><{$languages['REMARK']}></div>
</div>
<div id="awaiting-header-content" style="display:none;">
        <div style="width:17%" class="cell"><{$languages['ASNCODE']}></div>
        <div style="width:12%" class="cell"><{$languages['REFERENCE_NO']}></div>
        <div style="width:10%" class="cell"><{$languages['TYPE']}></div>
        <div style="width:20%" class="cell"><{$languages['CREATED_DATE']}></div>
        <div style="width:10%" class="cell"><{$languages['QUANTITY']}></div>
        <div style="width:20%" class="cell"><{$languages['REMARK']}></div>
        <div style="width:11%" class="cell no-background"><{$languages['ACTIONS']}></div>
</div>
<div id="received-header-content" style="display:none;">
        <div style="width:20%" class="cell"><{$languages['ASNCODE']}></div>
        <div style="width:20%" class="cell"><{$languages['REFERENCE_NO']}></div>
        <div style="width:20%" class="cell"><{$languages['TYPE']}></div>
        <div style="width:20%" class="cell"><{$languages['QUANTITY']}></div>
        <div style="width:20%" class="cell no-background"><{$languages['RECEIVED_QUANTITY']}></div>
</div>